<template>
    <div class="container w-50 p-3 shadow border border-1 my-5">
        <h1 class="h1 text-center"><i>查询</i></h1>
        <div class="row my-3">
            <div class="col-lg-6">
                <div class="form-group">
                  <input type="text" class="form-control" v-model="inputData"
                  aria-describedby="helpId" placeholder="请输入价格以查询">
                </div>
            </div>
            <div class="col-lg-3">
                <button @click="search" type="button" class="btn btn-outline-success col-12">搜索</button>
            </div>
            <div class="col-lg-3">
                <button @click="reset" type="button" class="btn btn-outline-danger col-12">重置</button>
            </div>
        </div>
        <son/>
    </div>  
</template>

<script setup>
import { ref } from 'vue';
import useMyStore from './store';
import son from './son.vue';

const inputData = ref('')

const myStore = useMyStore()

const search = e =>{
    // ++myStore.price;
    myStore.getPrice({price:inputData.value})
    inputData.value=''
}
const reset = e =>{
    inputData.value=''
    myStore.$reset()
}


</script>

<style lang="scss" scoped>


</style>